{% extends 'base.html' %}

{% block head %}
    <script>
    $(function () {
        $('.col07').each(function () {
            count = $(this).prev().text();
            price = $(this).prev().prev().text();
            $(this).html(parseFloat(count,2)*parseFloat(price,2)+'元')
        })
    })
    </script>

{% endblock %}

{% block center_body %}
	
	<h3 class="common_title">确认收货地址</h3>

	<div class="common_list_con clearfix">
		<dl>
			<dt>寄送到：</dt>
			<span><input type="radio" name="" checked="checked"></span>
            当前地址：<span class="user_info_check">{{ user.uaddress }}</span>
            收件人：<span class="user_info_check">{{ user.ushou }} </span>
            电话：<span class="user_info_check">{{ user.uphone }}</span>
		</dl>
		<a href="{% url "df_user:site" %}" class="edit_site">编辑收货地址</a>

	</div>
	
	<h3 class="common_title">支付方式</h3>	
	<div class="common_list_con clearfix">
		<div class="pay_style_con clearfix">
			<input type="radio" name="pay_style" checked>
			<label class="cash">货到付款</label>
			<input type="radio" name="pay_style">
			<label class="weixin">微信支付</label>
			<input type="radio" name="pay_style">
			<label class="zhifubao"></label>
			<input type="radio" name="pay_style">
			<label class="bank">银行卡支付</label>
		</div>
	</div>

	<h3 class="common_title">商品列表</h3>
	
	<div class="common_list_con clearfix">
		<ul class="goods_list_th clearfix">
			<li class="col01">商品名称</li>
			<li class="col02">商品单位</li>
			<li class="col03">商品价格</li>
			<li class="col04">数量</li>
			<li class="col05">小计</li>		
		</ul>
        {% for cart in carts %}
        <ul class="goods_list_td clearfix" id="{{ cart.id }}">
			<li class="col01">{{ forloop.counter }}</li>
			<li class="col02"><img src="{{ MEDIA_URL }}{{ cart.goods.gpic }}"></li>
			<li class="col03">{{ cart.goods.gtitle }}</li>
			<li class="col04">{{ cart.goods.gunit }}</li>
			<li class="col05">{{ cart.goods.gprice }}</li>
			<li class="col06">{{ cart.count }}</li>
			<li class="col07">25.80元</li>
        </ul>
        {% endfor %}

	</div>

	<h3 class="common_title">总金额结算</h3>
{#	<h3 class="common_title">订单提交时间{{ value|time }}</h3>#}

	<div class="common_list_con clearfix">
		<div class="settle_con">
			<div class="total_goods_count">共<em>{{ carts|length }}</em>件商品，总金额<b>{{ total_price }}</b></div>
			<div class="transit">运费：<b>{{ trans_cost }}元</b></div>
			<div class="total_pay">实付款：<b>{{ total_trans_price }}</b></div>
		</div>
	</div>

	<div class="order_submit clearfix">
		<a href="javascript:;" id="order_btn">提交订单</a>
	</div>	

		<div class="popup_con">
		<div class="popup">
			<p>订单提交成功！</p>
		</div>

		<div class="mask"></div>
	</div>

	<script type="text/javascript">
		$('#order_btn').click(function() {
		    //检查当前收货地址是否正确
		    $('.user_info_check').each(function () {
		        text = $(this).text();
				number = 0;
		        if (text == ''){
					number = 1;
				}
            });
			if (number == 1){
				alert('请填写正确的收货地址');
				window.location.href = '{% url "df_user:site" %}';
			}

		    //获取所有id，拼接成字符串
            cartids = '';
            $('.goods_list_td').each(function () {
               cartids = cartids + $(this).attr('id') +','
            });
		    cartids = cartids.substring(0,cartids.length-1);
		    total = {{ total_trans_price }};
		    data = {
		            'cart_ids':cartids,
                    'total':total,
                    'csrfmiddlewaretoken':'{{ csrf_token }}'
		    };

		    //先发请求
            $.post('/order/push/',data,function (data) {
                //成功

                if (data.ok == 1){
                    localStorage.setItem('order_finish',2);

                    $('.popup_con').fadeIn('fast', function() {

                        setTimeout(function(){
                            $('.popup_con').fadeOut('fast',function(){
                                window.location.href = '{% url "df_user:order" 1 %}';
                            });
                        },1000)
                    });
                }
                else {
                    alert('订单提交失败')
                }
            })
		});
	</script>
{% endblock center_body %}

